/******************** 变量 ********************/
$lv-select-option-item-background-hover: $item-background-hover !default;
$select-color-state: (default, $border-color-base, $input-background, $text-color), (hover, $border-color-hover, $input-background, $text-color),
  (focus, $input-border-color-focus, $input-background, $text-color), (active, $border-color-active, $input-background, $text-color),
  (disabled, $border-color-disabled, $disabled-background, $text-color-disabled) !default;

// select
.lv-select {
  display: inline-block;
  width: 100%;
  color: $text-color;
  font-size: $font-size-base;
  font-family: $font-family;
  line-height: $line-height-base;
  vertical-align: middle;
  cursor: pointer;

  &:focus-visible {
    outline: none;
  }

  &.lv-select-simple {
    width: max-content;
    max-width: 100%;
  }

  &.disabled {
    cursor: not-allowed;
  }

  &.lv-select-inline {
    .lv-select-panel {
      margin: 0;
      padding: 0;
      border-radius: 0;
      box-shadow: none;
    }
  }
}

// 下拉选项
.lv-option.lv-option-multiple {
  display: flex;
  align-items: center;

  .lv-option-checkbox + .lv-option-container {
    margin-left: $margin-sm;
  }

  .lv-option-container.lv-option-readonly {
    margin-left: $margin-lg;
  }
}

.lv-option.lv-option-hover-disabled {
  cursor: auto;

  &:hover {
    background-color: $select-option-bg-color;
  }
}

.lv-option-container {
  overflow: hidden;
}

.lv-select-panel-origin {
  .lv-option-container {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: space-between;

    .lv-subselect-trigger {
      flex: 1;
      overflow: hidden;
      word-break: break-word;
    }
  }
}

.lv-select-panel {
  margin: $margin-xs 0;
  overflow: hidden;
  outline: none;
  @include panel-default-style;
}

.lv-select-panel-width {
  --panel-width: 100%;

  width: var(--panel-width);
}

.lv-subselect {
  display: block;
}

.lv-subselect-panel {
  min-width: 1.68rem;
}

.lv-select-panel-content {
  max-height: 2rem;
  overflow: auto;

  @include component-scroll;

  .cdk-virtual-scroll-orientation-vertical .cdk-virtual-scroll-content-wrapper {
    width: 100%;
  }
}

.lv-virtual-panel-content {
  @include component-scroll;
}

.lv-option {
  display: flex;
  align-items: center;
  padding: 0 $padding-sm;
  color: $text-color;
  background: $select-option-bg-color;
  cursor: pointer;
}

.lv-option {
  *,
  .lv-checkbox * {
    color: inherit;
  }

  &:hover,
  &.hover {
    background: $lv-select-option-item-background-hover;
  }

  &:not(.lv-option-multiple).selected {
    @include panel-option-selected;
  }

  &.disabled {
    color: nth(nth($select-color-state, 5), 4);
    background: $component-background;
    cursor: not-allowed;
  }
}

.lv-select-selection-null {
  @include panel-dropdown-empty-style;
}

.lv-select-single {
  .lv-select-trigger {
    // 自定义样式: 展示区 头 底
    overflow: hidden;
  }
}

// search
.lv-select-panel-search {
  display: flex;
  padding: $padding-sm;

  .lv-search {
    width: 100%;
  }
}

// search
.lv-select-panel-z-index {
  z-index: $zindex-select;
}

.lv-option:not(.lv-option-multiple):not(.selected) {
  .lv-select-more {
    color: $text-color-secondary;
  }
}

.lv-select-disabled-icon {
  margin-left: $margin-md;
}

.lv-select-panel-default {
  .lv-option {
    min-height: $height-base;
  }
}

.lv-select-panel-large {
  .lv-option {
    min-height: $height-lg;
  }
}

.lv-select-panel-small {
  .lv-select-selection-null {
    font-size: $font-size-sm;
  }

  .lv-option {
    min-height: $height-sm;
    font-size: $font-size-sm;
  }
}

.lv-select-show-add-option {
  border-top: $border-width-base $border-style-base $border-color-split;
  padding: $padding-sm $padding-md;

  .lv-select-add-option-box {
    display: flex;
    align-items: center;

    i {
      margin-right: $margin-xs;
    }
  }

  .lv-select-add-option-btn-container {
    display: flex;
    justify-content: flex-end;
    margin-top: $padding-md;
    .lv-button {
      margin-left: $margin-sm;
    }
  }
}
